<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>详情</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no,email=no,address=no"/>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <link rel="stylesheet" href="../css/common.css"/>
    <link rel="stylesheet" href="../css/main.css"/>
</head>
<body class="bw">
    <div class="plr24">
        <div class="ptb20 bdb">
            <p>广告名称:<span class="ml10" id="name"></span></p>
            <p class="col9 mt10 font13" id="time"></p>
        </div>
    </div>
    <section id="viewShowMain" class="p24" style="height: 6rem;"></section>
</body>
</html>
<script src="../js/jquery-1.8.3.min.js"></script>
<script src="../js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/dlc.js"></script>
<script>
    dlc_request('/api/advertising/adversitingInfo',{'id':getUrlParam('id')},function(res){
        console.log(res);
        if(res.code == 1){
            $('#name').text(res.data.name);
            $('#time').text(format(res.data.createTime,'Y-m-d H:i:s'));
        }else{
            dlctipbox.show(res.msg);
        }
    });
    dlc_request('/api/advtotal/advOnLineList',{'page':1,'limit':99999,'advId':getUrlParam('id')},function(res){
        console.log(res);
        if(res.code == 1){
            var res = res.page.list;
            var data1 = [];
            var data2 = [];
            var data3 = [];
            for(var i in res){
                data1.push(res[i].clickNum);
                data2.push(res[i].showNum);
                data3.push(format(res[i].createTime,'m-d'));
            }
            echart(data1, data2, data3);
        }else{
          dlctipbox.show(res.msg);
        }
    });
//    var data1 = [120, 132, 101, 134, 90, 230, 210];
//    var data2 = [150, 232, 201, 154, 190, 330, 410];
//    var data3 = ['周一','周二','周三','周四','周五','周六','周日'];
    function echart(data1, data2, data3) {
        var myChart = echarts.init(document.getElementById('viewShowMain'));
        option = {
            title: {
                text: ''
            },
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data: ['点击次数', '展示次数'],
            },
            grid: {
                left: '8%',
                right: '5%',
                bottom: '22%',
                containLabel: false
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: data3,
            },
            yAxis: {
                type: 'value',
                axisLabel: {
                    formatter: '{value}',
                },
                axisLine: {
                    lineStyle: { color: '#D9D9D9' }
                },
                splitLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,0.8)'
                    }
                },
                boundaryGap: false,
                data: ['0', '1', '2', '3', '4', '5','6','7','8']
            },
            dataZoom: [
                {
                    show: true,
                    realtime: true,
                    start: 0,
                    end: 100
                },
                {
                    type: 'inside',
                    realtime: true,
                    start: 0,
                    end: 100
                }
            ],
            series: [{
                name: '点击次数',
                type: 'line',
                "itemStyle": {
                    "normal": {
                        "color": "rgba(48,161,233,1)",
                    }
                },
                label: {
                    normal: {
                        show: true,
                        color: '#000',
                        position: 'top'
                    }
                },
                data: data1,

            },
                {
                    name: '展示次数',
                    type: 'line',
                    "itemStyle": {
                        "normal": {
                            "color": "rgba(233,85,19,1)",
                        }
                    },
                    label: {
                        normal: {
                            show: true,
                            color: '#000',
                            position: 'top'
                        }
                    },
                    data: data2,

                }
            ]
        };
        myChart.setOption(option);
    }
</script>

















